<template>
    <div>
        <div id="bookresult">
            <div class="item" v-for="book in books" :key="book.isbn">
                <span id="img-div"><img :src="require(`../assets/bookimg/${book.isbn}.jpg`)" @click="$emit('change',book)"></span>
                <div class="bookmess">
                    <span id="bookname" @click="$emit('change',book)">{{book.bookname}}</span>
                    <span>作者：{{book.author}}</span>
                    <span>出版社：{{book.pubfirm}}</span>
                    <span>类型：{{book.type}}</span>
                </div>
                <div class="money">
                    <span id="num">￥{{book.price}}</span>
                    <span>库存:{{book.stock}}</span>
                    <button @click="addCart(book)">加入购物车</button>
                </div>
            </div>
            <h3>{{mess}}</h3>
        </div>
        <!--底部  -->
        <div id="footer">
            <p>
                
           
            </p>
        </div>
    </div>
</template>
<script>
export default {
    name: 'Bookitems',
    props: {
        books: [],
        mess:null,
    },
    methods:{
        addCart:function(book){
            if(sessionStorage.username){
                this.$store.commit('addCart',book)
            }else{
                this.$router.push({path:'/init'})
            }
        }
    },
}
</script>
<style src="../style/bookresult.css" scoped>

</style>